<template>
  <div>
    <el-dialog :visible.sync="dialogVisibility">
      <el-form
        ref="modifyAudit"
        class="modifyAudit"
        :model="modifyAudit"
        :rules="rules"
        label-position="right"
        label-width="auto"
      >

        <el-form-item label="ID">
            <span class="idStyle">ID: {{ modifyAudit.leaveId }}</span>
        </el-form-item>
        <el-form-item label="请假类型">
          <span>{{ leaveTypeFormat.text }}</span>

        </el-form-item>
        <el-form-item label="请假人">
          <span>{{ modifyAudit.applier }}</span>
        </el-form-item>
        <el-form-item label="申请时间">

            <span>{{ modifyAudit.startTime.substr(0, 10) }}</span> 至
            <span>{{ modifyAudit.endTime.substr(0, 10) }}</span>

        </el-form-item>

        <el-form-item label="请假原因：">
          <span v-text="modifyAudit.reason"> </span>
        </el-form-item>

        <el-form-item prop="auditorWord" label="审核意见：">
          <el-input type="textarea" v-model="modifyAudit.auditorWord">
          </el-input>
        </el-form-item>

        <el-form-item>
          <el-button type="primary" icon="el-icon-edit" @click="auditSucceed"
            >审核通过
          </el-button>
          <el-button type="danger" icon="el-icon-remove" @click="auditFailure"
            >审核不通过
          </el-button>
        </el-form-item>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
// import New from './components/New.vue';
import {leaveModuleApi} from "@/api/apis";
import { mapState } from "vuex";
export default {
  name: "ModifyLeaveAudit",
  components: {
    // New,Old,
  },
  props: {
    sampleP: {
      type: Number,
      default: 0,
    },
  },
  data() {
    return {
      sampleD: "value",
      modifyAudit: {
        leaveId: 23,
        leaveType: "issueLeave",
        reason: "前端开发一定要通过",
        startTime: "2021-07-27T06:40:33.163",
        endTime: "2021-07-27T16:00:00",
        applier: "anonymous007",
        applyState: "submitted",
        applyTime: "2021-07-28T14:43:49.245",
        auditState: "notAudit",
        auditor: null,
        auditorWord: null,
      },
      dialogVisibility: false,
      rules: {},
    };
  },
  computed: {
    // sampleC() {
    //     return this.sampleD+'--';
    // }
    ...mapState(["leaveTypes", "auditStates", "applyStates"]),
    leaveTypeFormat() {
      return this.leaveTypes.find(
        (x) => x.value === this.modifyAudit.leaveType
      );
    },
  },
  created() {},
  mounted() {},
  methods: {
    sampleM() {},
    openToModify(entity) {
      this.modifyAudit = entity;
      this.$nextTick(() => {
        this.dialogVisibility = true;
      });
    },
    auditSucceed() {
      // this.$http({
      //   method: "put",
      //   url: "/leaveAbout/leave/audit/succeed",
      //   data: this.modifyAudit,
      // })
      leaveModuleApi.leaveAuditSucceedApi(this.modifyAudit)
      .then((res) => {
        this.$message.warning(JSON.stringify(res.data));
        this.dialogVisibility = false;
        this.$emit("afterAudit", 1);
      });
    },
    auditFailure() {
      // this.$http({
      //   method: "put",
      //   url: "/leaveAbout/leave/audit/failed",
      //   data: this.modifyAudit,
      // })
      leaveModuleApi.leaveAuditFailedApi(this.modifyAudit)
      .then(
        (res) => {
          this.$message.warning(JSON.stringify(res.data));
          this.dialogVisibility = false;
          this.$emit("afterAudit", 1);
        },
        (error) => {
          console.log(".modifyAudit request error : " + error.response.status);
        }
      );
    },
  },
  watch: {
    // sampleC(newValue, oldValue) {
    //
    // }
  },
};
</script>

<!--<style scoped>-->
<style lang="scss" scoped>
.idStyle {
}

</style>
